// production-order-info.js
const ProductionOrderInfo = {
  template: `
    <div class="order-form-container">
      <el-card>
        <el-descriptions :column="3" border>
          <!-- 第一行 -->
          <el-descriptions-item label="订单号" :span="1">
            <el-text>{{ formattedWorkorder.JM_WORKORDERID }}</el-text>
          </el-descriptions-item>
          <el-descriptions-item label="计划类型" :span="1">
            <el-select
              v-model="formattedWorkorder.WOPLTYPE"
              disabled
            >
              <el-option
                label="一般"
                :value="0"
              />
              <el-option
                label="返工"
                :value="1"
              />
              <el-option
                label="改制"
                :value="2"
              />
              <el-option
                label="补充"
                :value="3"
              />
              <el-option
                label="报废"
                :value="4"
              />
            </el-select>
          </el-descriptions-item>
          <el-descriptions-item label="指令类型" :span="1">
            <el-text>{{ formattedWorkorder.commandType || '-' }}</el-text>
          </el-descriptions-item>

          <!-- 第二行 -->
          <el-descriptions-item label="料号" :span="1">
            <el-text>{{ formattedWorkorder.MATCODE }}</el-text>
          </el-descriptions-item>
          <el-descriptions-item label="物料描述" :span="1">
            <el-text>{{ formattedWorkorder.MATNAME }}</el-text>
          </el-descriptions-item>
          <el-descriptions-item label="计划交期" :span="1">
            <el-text>{{ formatDate(formattedWorkorder.WOCOMDATE) }}</el-text>
          </el-descriptions-item>
          <el-descriptions-item label="计划数" :span="1">
            <el-text>{{ formattedWorkorder.WOPLANQTY }}</el-text>
          </el-descriptions-item>

          <!-- 第三行 -->
          <el-descriptions-item label="排产数" :span="1">
            <el-text>{{ formattedWorkorder.WOSCHEDULEQTY || '-' }}</el-text>
          </el-descriptions-item>
          <el-descriptions-item label="计划开工" :span="1">
            <el-text>{{ formatDate(formattedWorkorder.WOPLANDATE) }}</el-text>
          </el-descriptions-item>
          <el-descriptions-item label="完工数" :span="1">
            <el-text>{{ formattedWorkorder.WOCOMPQTY || '-' }}</el-text>
          </el-descriptions-item>

          <!-- 第四行 -->
          <el-descriptions-item label="报废数" :span="1">
            <el-text>{{ formattedWorkorder.WOREJECTQTY || '-' }}</el-text>
          </el-descriptions-item>
          <el-descriptions-item label="完工日期" :span="1">
            <el-text>{{ formattedWorkorder.WOACTUALFINISHDATE || '-' }}</el-text>
          </el-descriptions-item>
          <el-descriptions-item label="加工批号" :span="1">
            <el-text>{{ formattedWorkorder.WOBATCHNO || '-' }}</el-text>
          </el-descriptions-item>

          <!-- 第五行 -->
          <el-descriptions-item label="计划号" :span="1">
            <el-text>{{ formattedWorkorder.WOERPID || '-' }}</el-text>
          </el-descriptions-item>
          <el-descriptions-item label="状态" :span="1">
            <el-tag :type="getStatusTagType(formattedWorkorder.WOSTATE)">
              {{ getStatusTagText(formattedWorkorder.WOSTATE) || '未开始' }}
            </el-tag>
          </el-descriptions-item>
          <el-descriptions-item label="优先级" :span="1">
            <el-text>{{ formattedWorkorder.WOLEVEL || '0' }}</el-text>
          </el-descriptions-item>

          <!-- 第六行 -->
          <el-descriptions-item label="包装方式" :span="1">
            <el-text>{{ formattedWorkorder.JOPPACKTYPE || '-' }}</el-text>
          </el-descriptions-item>
          <el-descriptions-item label="销售订单号" :span="1">
            <el-text>{{ formattedWorkorder.WOSELLORDER }}</el-text>
          </el-descriptions-item>
          <el-descriptions-item label="更新人" :span="1">
            <el-text>{{ formattedWorkorder.WOOPERATOR || '-' }}</el-text>
          </el-descriptions-item>

          <!-- 第七行 -->
          <el-descriptions-item label="更新时间" :span="1">
            <el-text>{{ formatDate(formattedWorkorder.LASTPRESCHEDULETIME) }}</el-text>
          </el-descriptions-item>
          <el-descriptions-item label="原订单号" :span="1">
            <el-text>{{ formattedWorkorder.ORIENTORDERID || '-' }}</el-text>
          </el-descriptions-item>
          <el-descriptions-item label="加工描述" :span="3">
            <el-text>{{ formattedWorkorder.WOMANDESCRIPTION || '-' }}</el-text>
          </el-descriptions-item>

          <!-- 第八行 - 备注跨3列 -->
          <el-descriptions-item label="备注" :span="3">
            <el-text>{{ formattedWorkorder.WOCOMMENTS || '-' }}</el-text>
          </el-descriptions-item>
        </el-descriptions>
      </el-card>
    </div>
  `,
  props: {
    workorder: {
      type: Object,
      required: true,
      default: () => ({})
    }
  },
  setup (props) {
    // 格式化日期（去掉时间部分）
    const formatDate = (dateString) => {
      if (!dateString) return '-';
      return dateString.split('T')[0];
    };

    // 直接使用传入的 workorder，但补充默认值
    const formattedWorkorder = Vue.computed(() => ({
      ...props.workorder,
      commandType: props.workorder.commandType || '-',
      WOSCHEDULEQTY: props.workorder.WOSCHEDULEQTY || '-',
      WOREJECTQTY: props.workorder.WOREJECTQTY || '-',
      WOACTUALFINISHDATE: props.workorder.WOACTUALFINISHDATE || '-',
      WOBATCHNO: props.workorder.WOBATCHNO || '-',
      WOSTATE: props.workorder.WOSTATE || '未开始',
      WOLEVEL: props.workorder.WOLEVEL || '0',
      JOPPACKTYPE: props.workorder.JOPPACKTYPE || '-',
      WOOPERATOR: props.workorder.WOOPERATOR || '-',
      ORIENTORDERID: props.workorder.ORIENTORDERID || '-',
      WOCOMMENTS: props.workorder.WOCOMMENTS || '-'
    }));

    // 根据状态获取标签类型
    const getStatusTagType = (status) => {
      switch (status) {
        case 0: return 'info';
        case 1: return 'primary';
        case 2: return 'warning';
        case 3: return 'success';
        default: return 'info';
      }
    };

    // 根据状态获取标签文字
    const getStatusTagText = (status) => {
      switch (status) {
        case 0: return '新建';
        case 1: return '开始';
        case 2: return '暂停';
        case 3: return '完工';
        default: return '';
      }
    };

    return {
      formatDate,
      formattedWorkorder,
      getStatusTagType,
      getStatusTagText
    };
  }
};

// 注册组件到全局
if (typeof window !== 'undefined' && window.Vue) {
  window.ProductionOrderInfo = ProductionOrderInfo;
}